<template>
  <div>
      <div>--------以下是代办清单-----------</div>
      <h3>{{msgFromChild}}</h3>
      <input v-model="text">
      <button @click="clearInput">清空</button>
      <button @click="$emit('addList',text)">提交</button>
      <button @click="$emit('removeAll')">重置清单</button>
  </div>
</template>

<script>
import {ref,onMounted} from 'vue'
import bus from "vue3-eventbus"
export default {
    setup(){
        // const msg = ref('我是子组件的值')
        const text = ref('')
        const msgFromChild = ref('')
        const clearInput = ()=>{
            text.value = ''
        };
        onMounted(()=>{
            bus.on('getMsg',msg =>{
                console.log('触发getMsg')
                msgFromChild.value = msg
            })
        })
        return{
           msgFromChild,
            text,
            clearInput
        }
    }
}
</script>

<style>

</style>